<#assign selfContent>
<i-button :disabled="detailsModel.${item.name}.disabled" type="primary" long <#if item.getPSUIAction?? && item.getPSUIAction()??>@click="uiAction(null, '${item.getPSUIAction().getUIActionTag()}', $event)"</#if> <#if item.getHeight() gt 0> style="height: ${item.getHeight()?c}px;"</#if>>
    <#if item.getPSSysImage()??>
    <#assign image = item.getPSSysImage()>
    <i class="${image.getCssClass()}"></i>
    </#if>
    <#if item.isShowCaption()>
    <span<#if item.getLabelPSSysCss()??> class="${item.getLabelPSSysCss().getCssName()}"</#if><#if item.getLabelPSSysCss()??> style="${item.getLabelPSSysCss().getRawCssStyle()}"</#if>>${item.getCaption()}</span>
    </#if>
</i-button>
</#assign>

<#ibizinclude>
./@MACRO/PLAYOUT.vue.ftl
</#ibizinclude>
<#if item.getParentLayoutMode()=='FLEX'>
<div v-show="detailsModel.${item.name}.visible" style="${flexAttr}<#if item.getWidth() gt 0>width: ${item.getWidth()?c}px;</#if><#if item.getPSSysCss()??>${item.getPSSysCss().getRawCssStyle()}</#if>" class="app-layoutpanel-button<#if item.getPSSysCss()??> ${item.getPSSysCss().getCssName()}</#if>">
    ${content}
</div>
<#else>
<i-col v-show="detailsModel.${item.name}.visible" ${tableAttr} style="${flexAttr}<#if item.getWidth() gt 0>width: ${item.getWidth()?c}px;</#if><#if item.getPSSysCss()??>${item.getPSSysCss().getRawCssStyle()}</#if>" class="app-layoutpanel-button<#if item.getPSSysCss()??> ${item.getPSSysCss().getCssName()}</#if>">
    ${content}
</i-col>
</#if>